<template>
  <div class="layout-all">
    <control :config="config" />
    <div class="layout-header" style="float: left;">
      <el-tag type="success" >总额:{{brokerage}}</el-tag>
    </div>
    <div class="layout-content">
      <el-table
        :data="tableData"
        stripe
        align="center"
        highlight-current-row
        style="width: 100%;margin-top:10px"
      >
      <el-table-column align="center" prop="id" label="序号" width="70" :fixed="isMobile()?'left':undefined"/>
        <el-table-column align="center" prop="order_sn" label="订单号" width="200"/>
        <el-table-column align="center" prop="level" label="分佣等级" width="80"/>
        <el-table-column align="center" prop="money" label="分佣金额" width="100"/>
        
        <el-table-column prop="user" label="领取者" >
          <template slot-scope="scope" v-if="scope.row.self_user!=undefined">
            {{scope.row.self_user.nickname+'('+scope.row.self_user.id+')'}}
          </template>
        </el-table-column>
        <el-table-column prop="user" label="领取者等级">
          <template slot-scope="scope" v-if="scope.row.self_user!=undefined">
            {{level_info[scope.row.self_user.level_id-1]+'('+scope.row.self_user.level_id+'级)'+(scope.row.self_user.proxy_id>1?(':'+proxy_info[scope.row.self_user.proxy_id-1]+'('+scope.row.self_user.proxy_id+'级)'):'')}}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="status_str" label="状态" width="100">
          <template slot-scope="scope">
            <el-tag :type="scope.row.status==0?'info':'success'">{{scope.row.status_str}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="trigger_user" label="分佣人" width="200">
          <template slot-scope="scope">
            {{scope.row.trigger_user && scope.row.trigger_user.nickname}}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="remark" label="描述"  />
        <el-table-column align="center" prop="create_time" label="创建时间" />
      </el-table>
    </div>
    <el-pagination
      :current-page="current_page"
      :page-size="per_page"
      layout="total, prev, pager, next, jumper"
      :total="total"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    />
  </div>
</template>

<script>
import control from "../../components/control/control";
export default {
  components: { control },
  data() {
    return {
      config: [
        { type: "text", placeholder: "请输入描述", field: "title", val: "" },
        {
          type: 'select',
          placeholder: '请选择状态',
          field: 'status',
          val: '',
          options: [
            { value: '', label: '全部' },
            { value: '1', label: '已分' },
            { value: '0', label: '未分' },
          ]
        },
        {
          type: 'date_time',
          placeholder: '请选择日期',
          field: 'date_time',
          val: '',

        },
      ],
      value: "",
      searchWhere: {
        title: "",
      },
      is_show: false,
      info_data: [],
      level_info: [],
      proxy_info: [],
      info_loading: false,
      tableData: [],
      total: 0,
      brokerage: 0,
      current_page: 1,
      per_page: 14,
    };
  },
  mounted() {
    this.onSearch();
  },
  methods: {
    onInfo(id) {
      this.is_show = true;
      this.info_loading = true;
      this.get("/admin/Commission/info", { id: id }, "POST").then((e) => {
        this.info_data = e.info.commission_logs;
        this.info_loading = false;
      });
    },
    // 查询
    handleSizeChange(val) {
      this.onSearch();
    },
    handleCurrentChange(val) {
      this.current_page = val;
      this.onSearch();
    },
    onSearch() {
      const form = {};
      form.page = this.current_page;
      form.map = this.searchWhere;
      this.get("/admin/Commission/index", form, "POST").then((e) => {
        this.tableData = e.list.data;
        this.per_page = e.list.per_page;
        this.total = e.list.total;
        this.current_page = e.list.current_page;
        this.brokerage = e.brokerage
        this.level_info = e.level_info
        this.proxy_info = e.proxy_info
      });
    },
    // 添加
    onAdd() {},
    // 编辑
    onEdit(id) {
      console.log(id);
    },
    // 修改状态
    change_status(id, field, val) {
      this.update(id, val, field, "Commission").then((e) => {
        e ? this.onSearch() : "";
      });
    },
    // 删除
    onDel(id) {
      this.$msg_confirm().then((e) => {
        if (e) {
          this.get("/admin/Commission/del?id=" + id, this.form, "POST").then(
            (e) => {
              this.onSearch();
            }
          );
        }
      });
    },
  },
};
</script>

<style>
.layout-all {
  margin-top: 20px;
  margin-left: 10px;
}
.layout-content {
  margin-top: 20px;
}
</style>>
